<!--suppress ALL -->
<script setup>
import { ref } from 'vue';
//引入模块
import Daytime from './daytime/Daytime.vue';
import Daytime2 from './daytime/Daytime2.vue';
import Daytime4 from './daytime/Daytime4.vue';
import Email from '../email/Email.vue';
import Always from './always/Always.vue';

// 用于存储从子组件接收到的数据
const receivedData = ref(false);

const handleDataFromChild = (data) => {
  // 将接收到的数据赋值给 receivedData
  receivedData.value = data;
};
</script>

<template>
    <!-- 内容 -->
    <el-row :gutter="12" class="content">
      <!-- 左侧内容 -->
      <el-col :span="18">
        <el-row  class="content">
          <el-col :span="24">
              <el-card>
                <h3>工资核算</h3>
                <Daytime4/>
              </el-card>
          </el-col>
        </el-row>
      </el-col>
      <!-- 右侧内容 -->
      <el-col :span="6">
        <el-row :gutter="10">
            <!-- 待办，邮件 -->
              <Email/>
              <el-col :span="24">
                <!-- 日历日程 -->
              </el-col>
              <el-col :span="24">
                <el-card class="days" >
                  <el-card class="day">
                    <Daytime @send-data="handleDataFromChild"/>
                  </el-card>
                  <Daytime2 v-if="receivedData"/>
                </el-card>
                <el-card >
                    <!-- 常用 -->
                    <Always/>
                </el-card>
              </el-col>
        </el-row> 
      </el-col>
    </el-row>    
</template>

  
<style>
.dashboard-container {
  display: flex;
  justify-content: space-between;
}
.finance{
  width: 100%;
  min-width:1410px;
}
.demo-progress {
  margin: 25px 15px;
  max-width: 100%;
}
.el-progress--line {
  max-width: 100%;
}
.mx{
  display: flex;
  justify-content: space-between;
}
.block{
  margin-left: 15px;
  width: 3px;
  height: 48px;
  background: rgba(1 ,1 ,1 ,0.1);
}
.el-card{
  margin-bottom:10px;
}
.day{
  margin: -20px;
  margin-bottom: 10px;
}
.tongji{
  width: 100%;
}
</style>